<script setup  lang="ts">
import { useUserStore } from "@/pinia/stores/user.js";
import  Header from "@@/components/Head/index.vue";
const userStore = useUserStore();
import { onBeforeMount, onMounted, ref, unref } from "vue"
const username = ref("")
const token = ref("")
const router = useRouter()
const id = ref(0)
onBeforeMount(() => {
  username.value = userStore.getUserName().value
  token.value = userStore.token
})
function goToUrl (type) {
  router.push({
    path: type
  })
}
</script>

<template>
  <div class="login-container child-view" style="width: 100%;height: auto;">
    <Header :activeId="5" />
    <div class="ai w-1200" element-loading-text="Loading...">
      <div class="ai-left">
        <div class="ai-left-tool">
          <div class="ai-left-tool-item">
            <div class="icon icon1" style="height: 31px; width: 31px;"  @click="goToUrl('/ai')"/>
            <div class="title" @click="goToUrl('/ai')">
              推荐
            </div>
          </div>
          <div class="ai-left-tool-item">
            <div class="icon icon2" style="height: 30px; width: 30px;"  @click="goToUrl('/ai2')"/>
            <div class="title" @click="goToUrl('/ai2')">
              问答
            </div>
          </div>
          <div class="ai-left-tool-item">
            <div class="icon icon3" style="height: 32px; width: 30px;"   @click="goToUrl('/ai3')"/>
            <div class="title" @click="goToUrl('/ai3')">
              学习
            </div>
          </div>
          <div class="ai-left-tool-item">
            <div class="icon icon5" style="height: 30px; width: 30px;" />
            <div class="title">
              专业工具
            </div>
          </div>
          <div class="ai-left-tool-item selected">
            <div class="icon icon6 " style="height: 30px; width: 30px;"   @click="goToUrl('/ai4')"/>
            <div class="title " @click="goToUrl('/ai4')">
              记录
            </div>
          </div>
          <div class="ai-left-tool-item">
            <div class="icon icon7" style="height: 30px; width: 30px;"   @click="goToUrl('/ai5')"/>
            <div class="title titleSelected" @click="goToUrl('/ai5')" >
              指南
            </div>
          </div>
        </div>
        <div class="recode-class scroll">
          <div class="title" style="line-height: 30px;margin-bottom: 10px;color: #0871c7">
            指南：
          </div>
          <div class="content">
            <div class="item" @click="id=1">
              <div class="desc">
                什么是SACA？
              </div>
            </div>
            <div class="item" @click="id=2">
              <div class="desc">
                SACA搜索如何运作？
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="ai-right scroll right-is-record">
        <!---->
        <!---->
        <!---->
        <!---->
        <div class="el-scrollbar" id="messageContainer1">
          <div class="el-scrollbar__wrap el-scrollbar__wrap--hidden-default" style="height: 772px;">
            <div class="el-scrollbar__view" v-if="id ===1" style="line-height: 28px;">
              <h2>什么是SACA？</h2>
              <p style="text-indent: 20px;">SACA是一个人工智能驱动的学术搜索引擎，建立在包含超过2.2亿篇语料的数据库之上。语料类型丰富，包含文献、资讯、政策、课件、数据等。与一般人工智能工具不同，每个回复都与真实的语料相关联，并以科学研究为基础。它可以帮助您快速查看高质量语料并更快地理解复杂的主题。</p>
              <p style="text-indent: 20px;">全球超过100万研究人员、学生和专业人士已经信任SACA来帮助他们的研究。它提供了更快、更有用的体验，并取代了多渠道分步检索等传统检索方式。</p>
              <p style="text-indent: 20px;">我们首先扫描包含超过2.2亿篇语料的整个数据库，以使用混合方法找到最相关的结果：</p>
              <p style="text-indent: 20px;">SACA通过总结和综合政策要求、研究成果、市场数据等语料使专业内容更易于理解。它还提供了三种重要卡片（摘要卡、应询卡、要素卡），使得查询、学习变得简单。</p>
            </div>
            <div class="el-scrollbar__view" v-if="id === 2" style="line-height: 24px;">
              <h2>SACA搜索如何运作？</h2>
              <p style="text-indent: 20px;">SACA旨在为您的结果找到最相关的语料，并为我们的AI生成的摘要奠定基础。每次搜索都会经历三个关键阶段：</p>
              <p>第1步：撒宽网</p>
              <p style="text-indent: 20px;">我们首先扫描包含超过2.2亿篇语料的整个数据库，以使用混合方法找到最相关的结果：</p>
              <p style="text-indent: 20px;">语义搜索（AI嵌入）：捕获搜索背后的意图并支持自然语言查询。</p>
              <p style="text-indent: 20px;">关键字搜索（BM25）：一种传统方法，将结果锚定到查询中的确切术语，以实现精确的关键字匹配。</p>
              <p style="text-indent: 20px;">这些方法协同工作，通过将您的查询与数据库中的标题、摘要和全文（如果可用）进行比较，为每篇论文分配相关性分数。这有助于显示与您的确切单词相匹配的语料，同时了解您真正想要的内容。</p>
              <p style="text-indent: 20px;">第2步：按质量细化</p>
              <p style="text-indent: 20px;">接下来，我们选出前1,500篇最相关的论文，并根据关键研究质量信号对它们进行重新排名：</p>
              <p>出版的最近期</p>
              <p>引用次数</p>
              <p>期刊影响力和声誉</p>
              <p>……</p>
              <p style="text-indent: 20px;">此步骤可确保您的结果具有高度相关性，并得到高质量、可信的科学支持。</p>
              <p>第3步：对前20篇论文进行排名</p>
              <p style="text-indent: 20px;">在最后一步中，我们尽可能准确地对前20篇论文进行排名。这与第2步类似，但包括两个关键升级：</p>
              <p style="text-indent: 20px;">使用更大、更强大的AI模型重新计算相关性</p>
              <p style="text-indent: 20px;">这种高精度模型仅应用于前20名论文，以确保效率和准确性</p>
              <p style="text-indent: 20px;">我们继续考虑新近度、引文次数和期刊影响力等关键要素，因此最终列表反映了相关性和严谨性。</p>
            </div>
          </div>
          <div class="el-scrollbar__bar is-horizontal" style="display: none;">
            <div class="el-scrollbar__thumb" style="transform: translateX(0%);" />
          </div>
          <div class="el-scrollbar__bar is-vertical" style="display: none;">
            <div class="el-scrollbar__thumb" style="transform: translateY(0%);" />
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<style src="@/pages/ai/style/index5.css"  scoped></style>
<style lang="scss" scoped>

</style>
